{% extends "base.html" %}
{% load comments %}
{% load i18n %}
{% load account socialaccount %}
{% block title %}正文{% endblock %}
{% block content %}
<HEAD>
<!-- 控制宽度的自动适应 -->
<style type="text/css">
.comments {
 width:100%;/*自动适应父布局宽度*/
 overflow:auto;
 word-break:break-all;
/*在ie中解决断行问题(防止自动变为在一行显示，主要解决ie兼容问题，ie8中当设宽度为100%时，文本域类容超过一行时，
当我们双击文本内容就会自动变为一行显示，所以只能用ie的专有断行属性“word-break或word-wrap”控制其断行)*/
}
</style>
<script>
function beforeSubmit(form){
if(form.id_name.value==''){
 form.id_name.value='游客'
}
if(form.id_comment.value==''){
alert('评论不能为空');
return false;
}
}
</script>
</HEAD>



      <header class="article-header">
        <h1 class="article-title">
			<a href="#">{{ article.title }}</a>
		</h1>
		  <div class="article-meta">
			  <h5>
				  作者：{{ article.user }}
		  		浏览量({{ article.views }})
			    {% get_comment_count for article as comment_count %}
			  	评论( {{ comment_count }})
			  </h5>
		  </div>
	  </header>
      <article class="article-content">

        <h4> {% autoescape off %}{{ article.wz}}{% endautoescape %} </h4>

		  <p class="article-copyright hidden-xs">未经允许不得转载</p>
      </article>




<div class="container">
<div class="row clearfix">



	<div class="col-md-12 column">

		<div class="panel panel-default">
			    <div class="panel-heading">
			        <h5>评论列表</h5>
			    </div>
				    <div class="panel-body">
				        {% get_comment_list for article as comments %}
				        {% for comment in comments %}
				            <div class="blog_comment" name="F{{comment.id}}">
				                <p class="comment_title">
				                   {{ comment.user_name }}在{{ comment.submit_date|date:"Y-m-d H:i"}} 评论：
				                </p>
				                <p class="comment_content">{{ comment.comment }}</p>
				              <hr style="border:1 dashed #987cb9" width="99%" color="#987cb9" size=1>
				            </div>            
				        {% empty %}
				            <span>暂无评论</span>
				        {% endfor %}
				    </div>
		     

			 <div class="panel-heading">
			        <h5>发表评论</h5>
			    </div>
			{% get_comment_form for article as blog_form %}
			<form id="comment_form" 
			      class="form-horizontal" 
			      action="{% comment_form_target %}" 
			      method="post"
				  onSubmit="return beforeSubmit(this)"
			> 
			    {% csrf_token %}
			    {# 必须的字段 #}
			    {{ blog_form.object_pk }}
			    {{ blog_form.content_type }}
			    {{ blog_form.timestamp }}
			
			    {{ blog_form.submit_date }}
			    {{ blog_form.security_hash }}

			    <div class="control-group">
<!--			        <label class="control-label" for="id_name">昵称：</label>-->
			        <div class="controls">
			            <input   type="hidden"
			                   id="id_name" class="input-xlarge" name="name" 
			                   placeholder="请输入昵称"
			                   value="{{ dl_user }}" />
			        </div>
			    </div>
			 
			   {# 邮箱地址字段 #}
			    <div class="control-group">
			        
			        <div class="controls">
			            <input  type="hidden"
			                   id="id_email" class="input-xlarge" name="email" 
			                   placeholder="请输入您的邮箱地址" 
			                   value=" 1@1.com" />
			        </div>
			    </div>

			 
			    {# 评论内容 #}
			    <a name="newcomment" id="newcomment"></a>
			    <div class="control-group">
<!--			        <label class="control-label" for="id_comment">评论： </label>-->
			        <div class="controls"  >
			            <textarea rows="8"
			                      id="id_comment" class="comments"  name="comment" 
			                      placeholder="请输入评论内容"></textarea>
			        </div>
			    </div>
			 
			    
			 
			    {# 表单按钮 #}
			    <div class="controls">
			        <div class="form-actions">
			            <input class="btn btn-info" id="submit_btn" type="submit" name="submit" value="提交"/>
			            <input type="hidden" name="next" value="/read/?id={{article.id}}"/>
			        </div>
			    </div>
			 </form>

			</div>
	</div>

</div>
</div>

{% endblock %}
{% block right %}
{% include 'right.html' %}
{%  endblock %}

